<style lang="less">
@import "../../styles/common.less";
</style>

<template>
  <div>
    <Card :bordered="false">
		<p slot="title">支付订单列表</p>
		<p>
			<RadioGroup v-model="dateSearchType" @on-change="changeSearchDate">
			  <Radio label="1">今日</Radio>
			  <Radio label="2">昨日</Radio>
			  <Radio label="3">最近七日</Radio>
			  <Radio label="4" disabled>自定义时间段</Radio>
			  <DatePicker
			    v-model="searchDateRange"
			    @click.native="dateChange"
			    type="daterange"
			    placement="bottom-end"
			    placeholder="订单日期"
			    style="width: 200px"
			  ></DatePicker>
			  

			  <Button type="success" @click="getData()">查询</Button>
			</RadioGroup>
			
			<Row class="margin-top-10 margin-bottom-10">
			  <Col span="24">
			    <RadioGroup v-model="orderStatus" type="button" size="large" @on-change="changeOrderStatus">
			        <Radio label="">全部</Radio>
			        <Radio label="0">待付款</Radio>
			        <Radio label="5">已付款</Radio>
			    </RadioGroup>
			  </Col>
			</Row>
			
			
			
			<Table :columns="columns1" :data="msgData.orders"></Table>
			<Spin size="large" fix v-if="spinShow"></Spin>
			
			<div style="margin: 20px 0;">
				<Page :total="msgData.total" :current="page" @on-change="switchPage"></Page>
			</div>
		</p>
    </Card>
  </div>
</template>

<script>
import table2excel from "@/libs/table2excel.js";
export default {
	components: {},
	data() {
	return {
		dateSearchType:"3",
		searchDateRange:"",
		page:1,
		msgData:{},
		columns1:[
			{title: '订单名称',key: 'orderNo'},
			{title: '支付订单号',key: 'transactionId'},
			{title: '订单金额',key: 'actualAmount'},
			{title: '订单状态',key: 'orderStatus'},
			{title: '付款方式',key: 'paymentMethod'},
			{title: '下单时间',key: 'orderTime'},
			{title: '订单完成时间',key: 'paymentTime'},
			
		],
		spinShow:true,
		orderStatus: "", //订单查询订单状态
	}
	},
	methods: {
		searchLeshuaOrder(page,orderStatus){
			if(page ==1){
				page=0;
			}else if(page > 1){
				page=page-1;
				page=page*10
			}
			let searchOptions = {
			  startIndex: page,
			  pageSize: 10,
			};
			let keyArray = [];
			keyArray.push('MERCHANT');
			searchOptions.merchantUuid = this.common.getObject('MERCHANTUUID');
			
			let dateType = this.dateSearchType;
			let startDate = null;
			let endDate = null;
			let currentDate = new Date();
			if (dateType == "1") {
			  startDate = currentDate;
			  endDate = currentDate;
			} else if (dateType == "2") {
			  currentDate.setDate(currentDate.getDate() - 1);
			  startDate = currentDate;
			  endDate = currentDate;
			} else if (dateType == "3") {
			  let tDate = new Date();
			  tDate.setDate(currentDate.getDate() - 7);
			  startDate = tDate;
			  endDate = currentDate;
			}else if (dateType == "4") {
				let t = this.searchDateRange;
				let startDateT = t[0];
				let endDateT = t[1];
				startDate = startDateT;
				endDate = endDateT;
			}
			searchOptions.orderDateStart = startDate;
			searchOptions.orderDateEnd = endDate;
			
			
			keyArray.push("ORDERDATE");
			
			if(orderStatus){
				searchOptions.orderStatus=orderStatus;
				keyArray.push("ORDERSTATUS");
			}
			
			
			searchOptions.keyArray = keyArray;
			console.log(searchOptions)
			this.$http.post("/merchant/searchLeshuaOrder", this.common.request(searchOptions)).then((res)=>{
				
				
				this.msgData=res.data.body.data;
				this.msgData.orders.forEach((obj)=>{
					if(obj.orderStatus == 5){
						obj.orderStatus="已完成"
					}else{
						obj.orderStatus="待付款"
					}
					
					if(obj.paymentMethod == 2){
						obj.paymentMethod ="支付宝";
					}else if(obj.paymentMethod == 1){
						obj.paymentMethod ="微信";
					}else{
						obj.paymentMethod ="未知";
					}
				})
				
				this.spinShow=false;
				console.log(this.msgData)
			});
			
		},
		changeSearchDate(){
			
		},
		dateChange(e){
			this.dateSearchType = "4";
		},
		getData(){
			this.spinShow=true;
			this.page=1;
			this.searchLeshuaOrder(0);
			
		},
		switchPage(e){
			this.spinShow=true;
			this.page=e;
			this.searchLeshuaOrder(this.page);
		},
		changeOrderStatus(e){
			this.searchLeshuaOrder(0,e);
		}
	},
	mounted() {
		this.searchLeshuaOrder(0);
	}
};
</script>
